import type {CEType, Viewer} from "vendor/components/pro-cesium";

import cameraImgUrl from "./img/icon/camera.png"

/**
 * 矢量图层
 */
export const loadVectorLayer = (CE: CEType, viewer: Viewer) => {
    function generatePosition(num: number) {
        var list = []
        for (var i = 0; i < num; i++) {
            var lng = 120.38105869 + Math.random() * 0.5
            var lat = 31.10115627 + Math.random() * 0.5
            list.push(new CE.Position(lng, lat))
        }
        return list
    }

    let baselayer = CE.ImageryLayerFactory.createAmapImageryLayer()
    viewer.addBaseLayer(baselayer)
    let layer = new CE.VectorLayer('layer')
    viewer.addLayer(layer)
    let positions = generatePosition(20)
    positions.forEach(item => {
        let billboard = new CE.Billboard(item, cameraImgUrl)
        layer.addOverlay(billboard)
    })
    viewer.flyTo(layer)
}

/**
 * 聚合(默认样式)
 */
export const loadPolymerization1 = (CE: CEType, viewer: Viewer) => {
    function generatePosition(num: number) {
        var list = []
        for (var i = 0; i < num; i++) {
            var lng = 120.38105869 + Math.random() * 0.5
            var lat = 31.10115627 + Math.random() * 0.5
            list.push(new CE.Position(lng, lat))
        }
        return list
    }

    let baselayer = CE.ImageryLayerFactory.createAmapImageryLayer()
    viewer.addBaseLayer(baselayer)
    let layer = new CE.ClusterLayer('layer')
    viewer.addLayer(layer)
    let positions = generatePosition(10000)
    positions.forEach(item => {
        let billboard = new CE.Billboard(item, cameraImgUrl)
        layer.addOverlay(billboard)
    })
    viewer.flyTo(layer)
}

/**
 * 聚合(聚合样式)
 */
export const loadPolymerization2 = (CE: CEType, viewer: Viewer) => {
    function generatePosition(num: number) {
        var list = []
        for (var i = 0; i < num; i++) {
            var lng = 120.38105869 + Math.random() * 0.5
            var lat = 31.10115627 + Math.random() * 0.5
            list.push(new CE.Position(lng, lat))
        }
        return list
    }

    let baselayer = CE.ImageryLayerFactory.createAmapImageryLayer()
    viewer.addBaseLayer(baselayer)
    let layer = new CE.ClusterLayer('layer',{style:'clustering'})
    viewer.addLayer(layer)
    let positions = generatePosition(10000)
    positions.forEach(item => {
        let billboard = new CE.Billboard(item, cameraImgUrl)
        layer.addOverlay(billboard)
    })
    viewer.flyTo(layer)
}

/**
 * 3DTiles图层
 */
export const load3dTile = (CE: CEType, viewer: Viewer) => {
    let baselayer = CE.ImageryLayerFactory.createAmapImageryLayer({
        style: 'img',
        crs:'WGS84'
    })
    viewer.addBaseLayer(baselayer)
    let layer = new CE.TilesetLayer('layer')
    viewer.addLayer(layer)
    const tileset = new CE.Tileset(
        '//resource.dvgis.cn/data/3dtiles/dayanta/tileset.json'
    )


    tileset.setHeight(-420)
    layer.addOverlay(tileset)
    viewer.flyTo(tileset)

    // // 设置点击事件
    // const Cesium = CE.Namespace.Cesium;
    // const handler = new Cesium.ScreenSpaceEventHandler(viewer.scene.canvas)
    // handler.setInputAction( (e: any) => {
    //     console.log("e->", e)
    //     const pick = viewer.scene.pick(e.position)
    //     if(Cesium.defined(pick)) {
    //         console.log("pick->", pick)
    //     }
    //
    // }, Cesium.ScreenSpaceEventType.LEFT_CLICK)
}


/**
 * geoJSON图层
 */
export const loadGeoJsonLayer = (CE: CEType, viewer: Viewer) => {
    let baselayer = CE.ImageryLayerFactory.createAmapImageryLayer({
        style: 'img',
        crs:'WGS84'
    })
    viewer.addBaseLayer(baselayer)

    let layer = new CE.GeoJsonLayer(
        'layer',
        'https://dc.dvgis.cn/examples/data/simplestyles.geojson'
    )
    viewer.addLayer(layer)
    viewer.flyTo(layer)
}

/**
 * html图层
 */
export const loadHTMLLayer = (CE: CEType, viewer: Viewer) => {
    function generatePosition(num: number) {
        var list = []
        for (var i = 0; i < num; i++) {
            var lng = 120.38105869 + Math.random() * 0.5
            var lat = 31.10115627 + Math.random() * 0.5
            list.push(new CE.Position(lng, lat))
        }
        return list
    }
    
    let baselayer = CE.ImageryLayerFactory.createAmapImageryLayer({
        style: 'img'
    })
    viewer.addBaseLayer(baselayer)
    let layer = new CE.HtmlLayer('layer')
    viewer.addLayer(layer)
    let positions = generatePosition(5)
    positions.forEach((item, index) => {
        let divIcon = new CE.DivIcon(
            item,
            `<div style="width:200px;background:rgba(255,255,0,0.2);color:#000">我是一个div，你可以对我添加css样式和内容</div>`
        )
        layer.addOverlay(divIcon)
    })

    viewer.flyToPosition(
        new CE.Position(120.472147621, 30.61004946, 65380.21, 14.0,  -40.94)
    )
}

/**
 * 动态图层
 */
export const loadDynamicLayer = (CE: CEType, viewer: Viewer) => {
    function generatePosition(num: number) {
        var list = []
        for (var i = 0; i < num; i++) {
            var lng = 120.38105869 + Math.random() * 0.5
            var lat = 31.10115627 + Math.random() * 0.5
            list.push(new CE.Position(lng, lat))
        }
        return list
    }

    let baselayer = CE.ImageryLayerFactory.createAmapImageryLayer({
        style: 'img'
    })
    viewer.addBaseLayer(baselayer)

    let layer = new CE.DynamicLayer('layer').addTo(viewer)
    for(let i = 0; i<50; i++){
        let model = new CE.DynamicModel(generatePosition(1)[0],'/asserts/examples/model/qiche.gltf')
        model.setStyle({
            scale:10
        })
        layer.addOverlay(model)
    }
    setInterval(()=>{
        layer.getOverlays().forEach(item=>{
            item.addPosition(generatePosition(1)[0],10)
        })
    },10000)

    viewer.flyTo(layer)
}


/**
 * CZML图层
 */
export const loadCzmlLayer = (CE: CEType, viewer: Viewer) => {
    let baselayer = CE.ImageryLayerFactory.createAmapImageryLayer({
        style: 'img'
    })
    viewer.addBaseLayer(baselayer)
    let layer = new CE.CzmlLayer('layer', '/asserts/examples/data/simple.czml')
    viewer.addLayer(layer)
}

